<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/moren.css">
    <link rel="stylesheet" href="./css/xiangqing.css">
    <link href="https://cdn.bootcdn.net/ajax/libs/Swiper/3.0.0/css/swiper.min.css" rel="stylesheet">
</head>
<body>
    <header>
        <div class="classification_top">
            <div class="classification_column">
            <div class="column_center">
               <a href="yemian4.html">Back</a>
            </div>
            <div class="column_center"><span>产品详情</span></div>
            <div class="column_center_1">
                <img src="./产品详情/形状9.png" alt="">
            </div>
            </div>
        </div>
    </header>
    <!-- 头部 -->
    <main>
        <div class="classification_picture">
            <div class="swiper-container">
                <div class="swiper-wrapper">
                    <div class="swiper-slide a">
                        <div class="tu_neirong"><img src="./产品详情/图层5.png" alt=""></div>
                       
                    </div>
                    <div class="swiper-slide b">
                        <div class="tu_neirong"><img src="./产品详情/图层5.png" alt=""></div>
                    </div>
                    <div class="swiper-slide c">
                        <div class="tu_neirong"><img src="./产品详情/图层5.png" alt=""></div>
                    </div>
                    <div class="swiper-slide c">
                        <div class="tu_neirong"><img src="./产品详情/图层5.png" alt=""></div>
                    </div>
                </div>
                <!-- 如果需要分页器 -->
                <!-- <div class="swiper-pagination"></div> -->
                
                <!-- 如果需要导航按钮 -->
                <!-- <div class="swiper-button-prev"></div>
                <div class="swiper-button-next"></div> -->
                
                如果需要滚动条
                <div class="swiper-scrollbar"></div>
            </div>
        </div>
        <!-- 轮播图 -->
        <div class="purchase">
            <span>￥32</span>
            <a href="#">购买</a>
        </div>
        <!-- 购买 -->
        <div class="praise">
            <div class="praise_1"><span style="cfont-family: MicrosoftYaHei;
                font-size: vw(30);
                color: #000000;"><img src="./产品详情/形状16副本.png" alt="">好评度</span><span style="font-family: MicrosoftYaHei;
	font-size: vw(30);
	color: #ff9344;">99%</span></div>
            <div class="praise_2">
                <span>共605个评价></span>
            </div>
        </div>
        <!-- 好评度 -->
        <div class="apply">
            <span>适用商户</span>
            <span>＞</span>
        </div>
        <!-- 适用用户 -->
        <div class="shop_content">
            <div class="shop_logo">
                <div class="shop_logo_1">
                    <span>正佳店</span>
                </div>
            </div>
            <div class="shop_text">
            <div class="text_1" >万岁寿司（正佳店）</div>
            <div class="text_2"><img src="./产品详情/形状16副本.png" alt="">
                <img src="./产品详情/形状16副本.png" alt="">
                <img src="./产品详情/形状16副本.png" alt="">
                <img src="./产品详情/形状16副本.png" alt="">
                <img src="./产品详情/形状16副本.png" alt="">10分</div>
            <div class="text_3">离你100m</div>
            <div class="text_4">查看详情 >></div>
            </div>
            <div class="shop_a">
                <a href="#">进入</a>
            </div>
        </div>
        <div class="shop_content_2">
            <div class="shop_logo">
                <div class="shop_logo_1">
                    <span>体育西路</span>
                </div>
            </div>
            <div class="shop_text">
            <div class="text_1" >万岁寿司（体育西路）</div>
            <div class="text_2"><img src="./产品详情/形状16副本.png" alt="">
                <img src="./产品详情/形状16副本.png" alt="">
                <img src="./产品详情/形状16副本.png" alt="">
                <img src="./产品详情/形状16副本.png" alt="">
                <img src="./产品详情/形状16副本.png" alt="">10分</div>
            <div class="text_3">离你100m</div>
            <div class="text_4">查看详情 >></div>
            </div>
            <div class="shop_a">
                <a href="#">进入</a>
            </div>
        </div>
        <div class="shop_content_3">
            <div class="shop_logo">
                <div class="shop_logo_1">
                    <span>昌岗店</span>
                </div>
            </div>
            <div class="shop_text">
            <div class="text_1" >万岁寿司（昌岗店）</div>
            <div class="text_2"><img src="./产品详情/形状16副本.png" alt="">
                <img src="./产品详情/形状16副本.png" alt="">
                <img src="./产品详情/形状16副本.png" alt="">
                <img src="./产品详情/形状16副本.png" alt="">
                <img src="./产品详情/形状16副本.png" alt="">10分</div>
            <div class="text_3">离你100m</div>
            <div class="text_4">查看详情 >></div>
            </div>
            <div class="shop_a">
                <a href="#">进入</a>
            </div>
        </div>
        <div class="shop_content">
            <div class="shop_logo">
                <div class="shop_logo_1">
                    <span>正佳店</span>
                </div>
            </div>
            <div class="shop_text">
            <div class="text_1" >万岁寿司（正佳店）</div>
            <div class="text_2"><img src="./产品详情/形状16副本.png" alt="">
                <img src="./产品详情/形状16副本.png" alt="">
                <img src="./产品详情/形状16副本.png" alt="">
                <img src="./产品详情/形状16副本.png" alt="">
                <img src="./产品详情/形状16副本.png" alt="">10分</div>
            <div class="text_3">离你100m</div>
            <div class="text_4">查看详情 >></div>
            </div>
            <div class="shop_a">
                <a href="#">进入</a>
            </div>
        </div>
        <!-- 店铺 -->
    </main>
    <!-- 架构 -->
    <footer>
        <div class="bottom_classification">
            <div class="classification_center"><a href="yemian1.html"><img src="./首页.png" alt=""></a>首页</div>
            <div class="classification_center"><a href="yemian2.html"><img src="./分类4.png" alt=""></a>分类</div>
            <div class="classification_center"><a href="yemian3.html"><img src="./形状7副本.png" alt=""></a>发现</div>
            <div class="classification_center"><a href="yemian5.html"><img src="./我的.png" alt=""></a>我的</div>
        </div>
    </footer>
    <!-- 底部 -->
    <script src="https://cdn.bootcdn.net/ajax/libs/Swiper/3.0.0/js/swiper.min.js"></script>
    <script>        
        var mySwiper = new Swiper ('.swiper-container', {
          direction: 'horizontal',
          loop: true,
          autoplay : 2000,
          effect : 'flip',
          // 如果需要分页器
          pagination: '.swiper-pagination',
          
          // 如果需要前进后退按钮
          nextButton: '.swiper-button-next',
          prevButton: '.swiper-button-prev',
          
          
          // 如果需要滚动条
        //   scrollbar: '.swiper-scrollbar',
        })        
        </script>
        <!-- 轮播图按钮 -->
</body>
</html>